$(function () {
    $('.tree li:has(ul)').addClass('parent_li');//.find(' > span').attr('title', 'Collapse this branch');
    $('.tree li.parent_li > span').on('click', function (e) {
        var children = $(this).parent('li.parent_li').find(' > ul > li');
        if (children.is(":visible")) {
            children.hide('fast');
            $(this).find(' > i').addClass('glyphicon-plus-sign').removeClass('glyphicon-minus-sign');
        } else {
            children.show('fast');
            $(this).find(' > i').addClass('glyphicon-minus-sign').removeClass('glyphicon-plus-sign');
        }
        e.stopPropagation();
    });
});


/**
 * 创建一个tree group 的html 节点.
 *
 */

function createTreeGroup(treegroup) {

    if (treegroup != null) {

        var nameserverdiv = "   <div class='row'> <div class='col-lg-12' >"
            + " <ol class='breadcrumb,  bg-" + treegroup._color + "' >"
            + "      <li class='active '>"
            + "         <i class='glyphicon glyphicon-flag'></i>  <i class='fa fa-quote-left '></i> &nbsp; " + treegroup._tree_group_name + treegroup._desc+ " &nbsp;   <i class='fa fa-quote-right '></i>"
            + "     </li> </ol> </div>  </div>";

        return nameserverdiv;

    } else {
        return null;
    }
}
/**
 * 创建一个shaperow 的节点, 里面包含很多的小方块
 * @param shapegroup
 * @returns {*}
 */
function createTreeRow(treegroup) {

    if (treegroup != null) {
        var rowDiv = $('<div></div>');
        rowDiv.addClass('tree');
        var ul = $('<ul></ul>');
        $.each(treegroup._children, function (idx, tpoic) {
            //  <!-- ## 第二层是topic, 他的children 每一个里面有三个固定的, 分别是一个brokerDatas 的列表, 一个 filterServerTable, 一个queueDatas 列表-->
            var shapFmt = "<li> <span class='bg-" + tpoic._color + "'><i class='glyphicon glyphicon-minus-sign '></i> " + tpoic._node_id + "</span>"

                + "       <span class='label label-info'> <i class='fa fa-quote-left '></i>  &nbsp;" + tpoic._desc + " &nbsp; <i class='fa fa-quote-right '></i> </span>"
                + "       <ul>";
            //   <!-- ## brokerDatas 的列表, 一个 filterServerTable, 一个queueDatas 列表 -->

            $.each(tpoic._children, function (idx, data) {
                shapFmt = shapFmt + "      <li>"
                    + "    <span class='bg-" + data._color + "'><i class='glyphicon glyphicon-minus-sign'></i> " + data._node_id + "</span>"
                    + "             <ul>";
                <!-- ##    -->
                if (data._children != null) {
                    $.each(data._children, function (idx, tmp) {
                        shapFmt = shapFmt + "                   <li>"
                            + "                  <span  class='bg-" + tmp._color + "'><i class='glyphicon glyphicon-minus-sign '></i> " + tmp._node_id + "</span>"
                            + "                   <span class='label label-info'>  <i class='fa fa-quote-left '></i> &nbsp;" + tmp._desc + "  &nbsp;<i class='fa fa-quote-right '></i> </span>"
                            + "                <ul>";
                        if (tmp._children != null) {
                            $.each(tmp._children, function (idx, temp) {
                                shapFmt = shapFmt + "                  <li>"
                                    + "                  <span   class='bg-" + temp._color + "' ><i class='glyphicon glyphicon-minus-sign'></i> " + temp._node_id + "</span>"
                                    + "                  <span class='label label-info'>   <i class='fa fa-quote-left '></i>&nbsp;" + temp._desc + "&nbsp;  <i class='fa fa-quote-right '></i> </span>"
                                    + "         </li>";
                            });
                        }
                        shapFmt = shapFmt + "         </ul>  </li>";
                    });
                }
                shapFmt = shapFmt + "   </ul>  </li>";
            });

            shapFmt = shapFmt + "   </ul>  </li>";
            ul.append(shapFmt);
        });
        rowDiv.append(ul);
        return rowDiv;
    } else {
        return null;
    }

}